// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'

// 导入重置样式和ele样式
import 'normalize.css/normalize.css'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/reset.css'
import 'element-ui/lib/theme-chalk/index.css'

import 'babel-polyfill'
import {
  checkMinor
} from 'common/src/utils/common'

// 导入自定义样式
import 'common/src/styles/index.scss'

import App from './App'
import { registerMicroApps, start, setDefaultMountApp,prefetchApps } from 'qiankun'
import microApps from './micro-app'
import router from './router'
import store from 'common/src/store/index'
import utils from 'common/src/utils/utils'
import SysDirective from 'common/src/directives'
import SysComponent from 'common/src/components/common'

// 导入第三方组件和国际化
import i18n from 'common/src/i18n'
// 导入全局mixinx 已废弃
// import Mixin from './mixins/index';
// Vue.mixin(Mixin);

// 预览附件
// import Viewer from 'v-viewer'
// import 'viewerjs/dist/viewer.css'
// import Print from 'vue-print-nb'
// Vue.use(Viewer)

// 导入mock数据
// process.env.NODE_ENV === 'mock' && require('@/mock')

Vue.prototype.$echarts = echarts // see webpack.base.conf
Vue.prototype._ = _ // see webpack.base.conf
Vue.prototype.$moment = moment // see webpack.base.conf

Vue.prototype.$utils = utils
utils.i18n = (key, value) => i18n.t(key, value)
Vue.prototype.$checkMinor = checkMinor

Vue.config.productionTip = false
Vue.use(ElementUI, {
  size: 'small', // set element-ui default size
  i18n: (key, value) => i18n.t(key, value)
})
// Vue.use(Print) // 注册
Vue.use(SysDirective)
Vue.use(SysComponent)

window.vueApp = new Vue({
  el: '#app',
  router,
  i18n,
  store,
  components: {
      App
  },
  data() {
      return {
          dialogVisible: false,
          message: null,
          detail: null,
          istimeOut: false,
          callback: function () { }
      }
  },
  methods: {
      showMsgBox(config) {
          if (_.isNil(config)) {
              config = {}
          }
          this.dialogVisible = true
          this.message = config.message
          this.detail = config.detail
          this.istimeOut = config.istimeOut
          this.callback = config.callback
      }
  },
  computed: {
      language() {
          return this.$store.getters.language
      },
  },
  template: `
      <div id="app">
          <App/>
          <el-dialog :visible.sync="dialogVisible" width="420px" class="edu-message-box"
              :close-on-click-modal="false"
              @close="callback">
              <div slot="title" style="display: flex; align-items:center;">
                  <template v-if="istimeOut">
                      <div class="edu-icon-confirm"></div>
                      <span class="el-dialog__title">{{language == 'en' ? 'Warning' : '警告'}}</span>
                  </template>
                  <template v-else>
                      <div class="edu-icon-notify"></div>
                      <span class="el-dialog__title">{{language == 'en' ? 'Prompt' : '提示'}}</span>
                  </template>
              </div>
              <p style="{word-break:break-all}">{{message}}
                  <el-tooltip :content="detail" placement="bottom" effect="light" v-if="detail">
                      <i class="el-icon-question"></i>
                  </el-tooltip>
              </p>
              <span slot="footer" class="dialog-footer">
              <el-button type="primary" @click="dialogVisible = false">{{$t('common.btn.confirm')}}</el-button>
              </span>
          </el-dialog>
      </div>
  `
})

const apps = microApps.map(item => {
  return {
    ...item,
    loader
  }
})

function loader(loading) {
    let instance = window.vueApp
    if (instance && instance.$children) {
      // instance.$children[0] 是App.vue，此时直接改动App.vue的isLoading
      instance.$children[0].loading = loading
    }
  }

registerMicroApps(apps, {
  // beforeLoad: app => {
  //   console.log('before load app.name====>>>>>', app.name)
  // },
  // beforeMount: [
  //   app => {
  //     console.log('[LifeCycle] before mount %c%s', 'color: green;', app.name)
  //   }
  // ],
  // afterMount: [
  //   app => {
  //     console.log('[LifeCycle] after mount %c%s', 'color: green;', app.name)
  //   }
  // ],
  // afterUnmount: [
  //   app => {
  //     console.log('[LifeCycle] after unmount %c%s', 'color: green;', app.name)
  //   }
  // ]
})

// prefetchApps([
//     { name: 'sub-app', entry: '//localhost:2021' },
// ])

// setDefaultMountApp('/sub-vue')
start({
    // prefetch:'all',
    // sandbox:false
})


